﻿@using OA.AspNetCore.Html;
@using OA.Model;
@using OA.Core.Model;
@using OA.Core.Helper
@model CustomForm
@{
    ViewBag.Title = "编辑打印模版";
    Layout = "~/Areas/Admin/Views/Shared/_form_layout.cshtml";
    List<string> positionLevels = ViewBag.PositionLevels;

    List<ExtendField> extendFields = ViewBag.ExtendFields;
    List<ExtendField> tables = ViewBag.Tables;
    string selectList = ViewBag.CompareList;
    List<ApprovalProcessNodeInfo> nodes = ViewBag.Nodes;
    int index = 0;
}
<style type="text/css">
    #Content .Step {
        width: 130px;
        height: 100px;
        float: left;
        line-height: 100px;
        margin-bottom: 20px;
    }

        #Content .Step:not(:last-child) {
            background: url(http://ciyun-oa.oss-cn-hangzhou.aliyuncs.com/nextStep.png) no-repeat 96px
        }

        #Content .Step .stepInfo {
            width: 100px;
            height: 100px;
            background-color: #ededed;
            cursor: pointer;
            float: left;
        }

    #Property .title {
        margin: 8px 0px;
    }

    .positions .layui-input-inline {
        margin: 6px 0;
    }

    .layui-tree li i {
        float: left !important
    }

    .layui-tree-branch {
        display: none;
    }

    .layui-tab-item .item {
        clear: both;
        float: left;
        margin-block: 8px;
        width: 100%;
    }

    .layui-tree i {
        line-height: 26px !important;
    }

    .layui-table th {
        text-align: center !important;
    }

    i.layui-icon-search {
        line-height: 16px !important;
    }

    .stepInfo div {
        line-height: 28px;
        vertical-align: middle;
        display: inline-block;
    }

    .lay-this {
        color: red;
    }

    .layui-form-select .layui-tree {
        min-width: 300px;
    }

    .xm-label .label-content {
        height: 30px;
        overflow: hidden;
    }

    .xm-select-demo {
        width: 180px !important;
        margin-bottom: 10px;
        float:left;
    }
    .layui-icon-close-fill {
        line-height:38px;margin-left:8px;color:red;cursor:pointer;
    }
    .position_item{width:100%;clear:both;}
</style>
<script type="text/javascript">
    var selectList = '@Html.Raw(selectList)';
    var dicOptions = @Html.Raw(ViewBag.DicOptions);
</script>
<script type="text/javascript" src="~/js/Sortable.js"></script>
<div style="background-color: #fff; padding: 10px; border: 1px solid #ddd;clear:both;height:42px;">
    <div style="float: left; width: 43px; height: 43px; overflow: hidden; cursor:pointer;" id="addItem" title="新增节点">
        <i class="layui-icon layui-icon-add-circle" style="font-size:38px;float:left;color:blue;"></i>
    </div>
    <div style="float: left; width: 180px; height: 43px; overflow: hidden; margin-left:20px;" id="deleteContent" title="删除节点，将模块拖到此处，删除节点">
        <i class="layui-icon layui-icon-delete" style="font-size:38px;float:left;color:red;"></i>
    </div>
    <div style="float:right;width:300px;text-align:right;display:inline-block;">
        <button type="button" class="layui-btn layui-btn-danger saveCustomForm">保存流程</button>
    </div>

</div>
<div class="layui-form layui-tab-content" style="padding:0px;text-align:center;margin:0 auto;margin-left:0px;margin-top:6px;">
    <div>
        @using (Html.BeginForm(FormMethod.Post, htmlAttributes: new { @class = "layui-form", id = "myForm" }))
        {
            @Html.AntiForgeryToken()
            <div id="Property" style="border: 1px solid #ddd; float: right; width: 570px; background-color: #fff; text-align:left;padding:10px;position:relative;">
                <div class="layui-tab">
                    <ul class="layui-tab-title">
                        <li class="layui-this" id="rowInfo">节点信息</li>
                        <li>权限设置</li>
                        <li>条件过滤</li>
                    </ul>
                    <div class="layui-tab-content">
                        <div class="layui-tab-item layui-show">
                            <div class="item">
                                <div class="title" title="节点名称">节点名称</div>
                                <div style="width:180px;">
                                    <input type="text" class="layui-input NodeName" id="NodeName" />
                                </div>
                            </div>
                            <div class="item">
                                <div class="title" title="节点类型">节点类型</div>
                                <div style="width: 180px; float: left;">
                                    <select name="TypeID" id="TypeID" lay-filter="TypeID" class="TypeID">
                                        <option value="1" selected="">普通节点</option>
                                        <option value="2">会签节点（表单指定）</option>
                                        <option value="3">组织上的上级</option>
                                    </select>
                                </div>
                                <div style="width: 158px; float: left;margin-left:20px; display:none;" class="PositionLeveDiv">
                                    <select name="PositionLeve" id="PositionLeve" lay-filter="PositionLeve" class="TypeID">
                                        @for (int i = 0; i < positionLevels.Count - 1; i++)
                                        {
                                            <option value="@positionLevels[i]">至 @positionLevels[i] 级别</option>
                                        }
                                    </select>
                                </div>
                                <div style="margin-left:20px;line-height:38px;float:left;" class="PositionLeveDiv">
                                    <input type="checkbox" id="AtLeastOneSuperior" name="AtLeastOneSuperior" class="AtLeastOneSuperior" lay-skin="primary" title="至少一个上级" lay-filter="AtLeastOneSuperior">
                                </div>
                            </div>
                            <style type="text/css">
                                .myPositions .Position {
                                    width: 200px;
                                }

                                    .myPositions .Position .select {
                                        width: 180px;
                                        float: left;
                                    }

                                    .myPositions .Position i {
                                        float: right;
                                        line-height: 38px;
                                        color: red;
                                        cursor: pointer;
                                    }
                            </style>
                            <div class="positions item" id="positions">
                                <div class="title" title="审批岗位">审批岗位(1-N)</div>
                                <div class="myPositions">
                                    <div class="Position">
                                         
                                    </div>
                                </div>
                                <div style="clear:both;margin-top:10px;">
                                    <button type="button" class="layui-btn layui-btn-sm" onclick="addPositionItem(0)" style="margin-right:12px;">增加审批岗位</button>
                                </div>
                            </div>

                        </div>
                        <div class="layui-tab-item EditableAndPrivacy">
                            <fieldset class="layui-elem-field layui-field-title" style="margin: 20px 0;clear:both;width:100%;float:left;">
                                <legend style="font-size:13px;">基础属性</legend>
                            </fieldset>
                            <table class="layui-table" style="text-align:center;">
                                <thead>
                                    <tr>
                                        <th style="width:180px;">表头</th>
                                        <th>属性名称</th>
                                        <th style="width:80px;">不可见</th>
                                        <th style="width:80px;">可编辑</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach (var item in extendFields)
                                    {
                                        if (item.Type == 30 || item.Type == 31 || item.Type == 40 || item.Type == 41 || item.Type == 42 || item.Type == 43 || item.Type == 44)
                                        {
                                            <tr>
                                                <td>#</td>
                                                <td>@item.Name</td>
                                                <td><input type="checkbox" disabled="disabled" class="Privacy Privacy_@item.Attribute" name="Privacy" value="@item.Attribute" lay-skin="primary" lay-filter="PrivacyAttribute"></td>
                                                <td><input type="checkbox" disabled="disabled" class="Editable Editable_@item.Attribute" value="@item.Attribute" lay-skin="primary" lay-filter="EditableAttribute"></td>
                                            </tr>
                                        }
                                        else
                                        {
                                            <tr>
                                                <td>#</td>
                                                <td>@item.Name</td>
                                                <td><input type="checkbox" class="Privacy Privacy_@item.Attribute" name="Privacy" value="@item.Attribute" lay-skin="primary" lay-filter="PrivacyAttribute"></td>
                                                <td><input type="checkbox" class="Editable Editable_@item.Attribute" value="@item.Attribute" lay-skin="primary" lay-filter="EditableAttribute"></td>
                                            </tr>
                                        }
                                    }
                                </tbody>
                            </table>

                            @foreach (var item in tables)
                            {
                                List<ExtendField> tableitems = JsonHelper.DeserializeList<ExtendField>(item.DefaultValue);
                                if (tableitems != null && tableitems.Count > 0)
                                {
                                    <fieldset class="layui-elem-field layui-field-title" style="margin: 20px 0;clear:both;width:100%;float:left;">
                                        <legend style="font-size:13px;">表格 @item.Name</legend>
                                    </fieldset>
                                    <table class="layui-table" style="text-align:center;">
                                        <thead>
                                            <tr>
                                                <th style="width: 180px;">表头</th>
                                                <th>属性名称</th>
                                                <th style="width:80px;">不可见</th>
                                                <th style="width:80px;">可编辑</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach (var item2 in tableitems)
                                            {
                                                if (item2.Type == 69) { continue; }
                                                <tr>
                                                    <td>@item2.ParentName</td>
                                                    <td>@item2.Name</td>
                                                    <td><input type="checkbox" class="Privacy Privacy_@item.Attribute-@item2.Attribute" value="@item.Attribute-@item2.Attribute" lay-skin="primary" lay-filter="PrivacyAttribute"></td>
                                                    <td><input type="checkbox" class="Editable Editable_@item.Attribute-@item2.Attribute" value="@item.Attribute-@item2.Attribute" lay-skin="primary" lay-filter="EditableAttribute"></td>
                                                </tr>
                                            }
                                        </tbody>
                                    </table>
                                }

                            }
                        </div>
                        <div class="layui-tab-item">
                            <table class="layui-table" id="myFilters">
                                <thead>
                                    <tr>
                                        <td colspan="5" style="color:red;text-align:center;">关于分组说明,系统会根据分组值进行分组，相同分组值的条件为一组，组内条件之间以 and 连接；不同组之间通过 or 连接</td>
                                    </tr>
                                    <tr>
                                        <th style="width:40px;">分组</th>
                                        <th>属性名称</th>
                                        <th style="width:140px;">对比类型</th>
                                        <th style="width:140px;">对比值(Value)</th>
                                        <th style="width:40px;">#</th>
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="5" class="right_content"><button type="button" class="layui-btn layui-btn-sm addCondition">增加一行</button></td>
                                    </tr>
                                </tfoot>
                            </table>
                            <table class="layui-table">
                                <thead>
                                    <tr>
                                        <td colspan="4" style="color:red;text-align:center;">示例</td>
                                    </tr>
                                    <tr>
                                        <th style="width:40px;">分组</th>
                                        <th>属性名称</th>
                                        <th style="width:140px;">对比类型</th>
                                        <th style="width:140px;">对比值</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td style="text-align:center;">0</td>
                                        <td>总金额</td>
                                        <td>大于等于</td>
                                        <td>1000</td>
                                    </tr>
                                    <tr>
                                        <td style="text-align:center;">0</td>
                                        <td>交通工具</td>
                                        <td>包含在value中</td>
                                        <td>飞机，高铁</td>
                                    </tr>
                                    <tr>
                                        <td style="text-align:center;">1</td>
                                        <td>级层</td>
                                        <td>大于</td>
                                        <td>经理</td>
                                    </tr>
                                    <tr>
                                        <td style="text-align:center;">2</td>
                                        <td>总金额</td>
                                        <td>包含在value中</td>
                                        <td>1000,5000</td>
                                    </tr>
                                    <tr>
                                        <td style="text-align:center;">2</td>
                                        <td>级层</td>
                                        <td>包含在value中</td>
                                        <td>总经理，经理，主管</td>
                                    </tr>
                                    <tr>
                                        <td colspan="4">解释：①总金额大于等于1000 并且 交通工具为飞机，高铁；②级层大于经理；③总金额在1000（包含）-5000（包含）之间并且级层为总经理，经理，主管。满足上面3个条件中的一个，则该节点在审批流程中。</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div id="Content" style="border: 1px solid #ddd; min-height: 707px; padding: 20px;  margin-right: 600px; background-color: #fff;">
                @foreach (var item in nodes)
                {
                    <div class="Step">
                        <div class="stepInfo item_@index" data-index="@index">
                            <div>@item.Name</div>
                            <input type="hidden" value="@JsonHelper.ToBase64(item)" class="data" />
                        </div>
                    </div>
                    index++;
                }
            </div>

        }
    </div>

</div>
<script type="text/javascript" src="~/js/base64.min.js"></script>
<script type="text/javascript" src="~/js/Sortable.js"></script>
<script type="text/javascript" src="/js/xm-select.js"></script>
<script type="text/javascript" src="/Admin/Home/GetXmSelectPositions"></script>
<script type="text/javascript">
    $("#Content").each(function (index, item) {
        new Sortable(item, {
            group: 'shared',
            animation: 150,
            onEnd: function (evt) {
                if ($(evt.to).prop("id") == "deleteContent" && $(evt.from).prop("id") == "Content") {
                    var origEl = evt.item;
                    var cloneEl = evt.clone;
                    cloneEl.innerHTML = "";
                    origEl.innerHTML = "";
                }
            },
        });
    });
    new Sortable(deleteContent, {
        group: 'shared',
        animation: 150,

    });
    var lastIndex = 1;
    if ($("#Content").find(".stepInfo").length > 0) { lastIndex = $("#Content").find(".stepInfo").last().attr("data-index"); }

    var newNodedata ="@ViewBag.NewNodeStr";
    $("#addItem").click(function () {
        var newIndex = parseInt(lastIndex) + 1;
        lastIndex = newIndex;
        $("#Content").append('<div class="Step"><div class="stepInfo item_' + newIndex + '" data-index="' + newIndex + '"><div>新节点</div><input type="hidden" value="' + newNodedata + '" class="data" /></div></div>');
    });
    var dataIndex = -1;
    function addCondition(config) {
        var tempid = "F_" + Math.ceil(Math.random() * 1000);
        var html = '<tr id="td_' + tempid + '">\
                    <td>\
                        <input type="text" value="'+ config.GroupID+'" data-id="GroupID" class="layui-input GroupID" />\
                    </td>\
                    <td>\
                        <select data-id="Attribute" class="Attribute" data-value="'+ config.Attribute + '" lay-filter="Attribute">' + selectList+'</select>\
                    </td>\
                    <td>\
                        <select data-id="Type" class="Type" data-value="'+ config.Type+'" lay-filter="CompareAttribute"><option value="1">小于 Value</option><option value="2">小于等于 Value</option><option value="3" selected >等于 Value </option><option value="4">大于等于 Value</option><option value="5">大于 Value</option><option value="6">包含在value中</option><option value="7">不包含在value中</option></select>\
                    </td>\
                    <td>\
                        <input type="text" data-id="Value" class="layui-input Value" value="'+ config.Value +'" />\
                        <div id="xmSelect_'+ tempid + '" class="xmSelect"></div>\
                    </td>\
                    <td>\
                        <span class="deleteItem">删除</span>\
                    </td>\
                </tr>';
        $("#myFilters tbody").append(html);
        form.render();
        if (dicOptions[config.Attribute] != null) {
            inintSelect("xmSelect_" + tempid, config.Value, dicOptions[config.Attribute]);
            $("#myFilters tbody tr").last().find(".Value").css("display", "none");
            $("#myFilters tbody tr").last().find(".xmSelect").css("display", "block");
        }
        else {
            $("#myFilters tbody tr").last().find(".Value").css("display", "block");
            $("#myFilters tbody tr").last().find(".xmSelect").css("display", "none");
        }
        $("select.Type").each(function (index, item) {
            $(item).val($(item).attr("data-value"));
        });
        $("select.Attribute").each(function (index, item) {
            $(item).val($(item).attr("data-value"));
        });
        layui.use(['form'], function () {
            var form = layui.form;
            form.on('select(Attribute)', function (data) {
                var objTr = $(data.elem).parent().parent();
                SetConfigFilters();
                if (dicOptions[data.value] != null) {

                    console.log("data.value:" + data.value);
                    console.log(dicOptions[data.value]);
                    var xmSelectID = $(data.elem).parent().parent().find(".xmSelect").prop("id");
                    inintSelect(xmSelectID, "", dicOptions[data.value]);
                    $(data.elem).parent().parent().find(".Value").css("display", "none");
                    $(data.elem).parent().parent().find(".xmSelect").css("display", "block");
                }
                else {
                    $(data.elem).parent().parent().find(".Value").css("display", "block");
                    $(data.elem).parent().parent().find(".xmSelect").css("display", "none");
                }
            });
        });

    }

    function inintSelect(id, values, data) {
        var items = []
        if (values != undefined && values != null) { items = values.split(","); }

        xmSelect.render({
            el: '#' + id,
            initValue: items,
            data: data,
            filterable: true,
            tree: {
                show: true,
                showFolderIcon: true,
                showLine: true,
                indent: 20,
                expandedKeys: true,
                strict: true
            },
            model: {
                label: {
                    type: 'text',
                    block: {
                        showCount: 1,
                        showIcon: false,
                    }
                }
            },
            on: function (data) {
                var result = [];
                $.each(data.arr, function (index, item) {
                    result.push(item.value);
                })
                $("#" + id).find(".xm-select-default").val(result.join(","));
                SetConfigFilters();
            }
        })

    }

    $(".addCondition").click(function () {
        addCondition({ GroupID: 0, Attribute: "", Type: 1, Value: "" });
    });

    $("#Content").on("click", ".stepInfo", function () {
        $("#Content .stepInfo").removeClass("lay-this");
        $(this).addClass("lay-this");
        dataIndex = $(this).attr("data-index");
        var base64Info = $(this).find(".data").val();
        var configStr = Base64.decode(base64Info);
        var configInfo = $.parseJSON(configStr);
        $("#NodeName").val(configInfo.Name);
        $("#TypeID").val(configInfo.Type);
        $("#positions").css("display", "none");
        $(".PositionLeveDiv").css("display", "none");
        $("#AtLeastOneSuperior").prop("checked", configInfo.AtLeastOneSuperior);
        $(".myPositions").html("");
        $("#myFilters tbody").html("");
        $("#PositionLeve").val(configInfo.LastPositionLevel);
        if (configInfo.Type == 3) {
            $(".PositionLeveDiv").css("display", "block");
        }
        else if (configInfo.Type == 1) {//普通节点
            $("#positions").css("display", "block");
        }

        if (configInfo.Positions != null && configInfo.Positions.length > 0) {

            for (var i = 0; i < configInfo.Positions.length; i++) {
                addPositionItem(configInfo.Positions[i]);
            }
        }


        $(".EditableAndPrivacy .Editable").prop("checked", false);
        $(".EditableAndPrivacy .Privacy").prop("checked", false);
        if (configInfo.HideAttribute != null && configInfo.HideAttribute.length > 0) {
            for (var i = 0; i < configInfo.HideAttribute.length; i++) {
                $(".EditableAndPrivacy .Privacy_" + configInfo.HideAttribute[i]).prop("checked", true);
            }
        }
        if (configInfo.AbledEditAttribute != null && configInfo.AbledEditAttribute.length > 0) {
            for (var i = 0; i < configInfo.AbledEditAttribute.length; i++) {
                $(".EditableAndPrivacy .Editable_" + configInfo.AbledEditAttribute[i]).prop("checked", true);
            }
        }

        if (configInfo.Filters != null && configInfo.Filters.length > 0) {
            var html = "";
            for (var i = 0; i < configInfo.Filters.length; i++) {
                addCondition(configInfo.Filters[i]);
            }

        }

        form.render();
        dicOptions.Approver = []
        $(".myPositions .Position").each(function () {
            if ($(this).find("input.layui-input-treeselect").length > 0) {
                var id = $(this).find("input.layui-input-treeselect").val();
                var name = $(this).find(".layui-this cite").text();
                dicOptions.Approver.push({ "id": id, "name": name, "spread": true, "children": null });
            }
        });
    })

</script>
<script type="text/javascript">
    function addPositionItem(defaultValue) {
        var tempid = "C_" + Math.ceil(Math.random() * 1000);
        $(".myPositions").append('<div class="position_item"><div id="' + tempid + '" name="PositionID" class="xm-select-demo" data-value="' + defaultValue + '"></div><i class="layui-icon layui-icon-close-fill"></i></div>');
        xmSelect.render({
            el: '#' + tempid,
            initValue: [defaultValue],
            data: xmSelectPositions,
            filterable: true,
            radio: true,
            clickClose: true,
            tree: {
                show: true,
                showFolderIcon: true,
                showLine: true,
                indent: 20,
                expandedKeys: true,
                strict: true
            },
            model: {
                label: {
                    type: 'text',
                    block: {
                        showCount: 1,
                        showIcon: false,
                    }
                }
            },
            on: function (data) {
                if (dataIndex < 0) return;
                $("#" + tempid).find(".xm-select-default").val(data.arr[0].value);
                var jsonInfo = getInfo();
                var positions = [];
                $(".positions .xm-select-default").each(function () {
                    console.log($(this).val());
                    if ($(this).val() != "" && $(this).val() != "0") {
                        positions.push(parseInt($(this).val()));
                    }
                });
                jsonInfo.Positions = positions;
                setInfo(jsonInfo);
            }
        })
    }

    $(".saveCustomForm").click(function () {

        layer.confirm('您确认是否需要保存当前流程设计？', {
            btn: ['确认保存', '取消'] //按钮
        }, function () {
             var infos = [];
            $("#Content .data").each(function (index, item) {
                infos.push($(item).val());
            });
            $.ajax({
                type: 'POST',
                url: '/Admin/CustomForm/SaveApprovalProcess',//发送请求
                traditional: true,
                data: { id:@Model.ID, infos: JSON.stringify(infos) },
                dataType: "json",
                success: function (result) {
                    if (result.State == 200) {
                        layer.msg("流程设计保存成功!");
                    }
                    else {
                        layer.msg(result.Msg);
                    }
                }
            },'json');
        });

    });

</script>
<script type="text/javascript">
    function getInfo() {
        if (dataIndex < 0) return;
        var obj = $(".Step .item_" + dataIndex);
        var base64Info = obj.find(".data").val();
        var configStr = Base64.decode(base64Info);
        return $.parseJSON(configStr);
    }
    function setInfo(jsonInfo) {
        var configStr = JSON.stringify(jsonInfo);
        base64Info = Base64.encode(configStr);
        var obj = $(".Step .item_" + dataIndex);
        obj.find(".data").val(base64Info);

        dicOptions.Approver = []
        $(".myPositions .Position").each(function () {
            if ($(this).find("input.layui-input-treeselect").length > 0) {
                var id = $(this).find("input.layui-input-treeselect").val();
                var name = $(this).find(".layui-this cite").text();
                dicOptions.Approver.push({ "id": id, "name": name, "spread": true, "children": null });
            }
        });

    }
    $("#Property #NodeName").on('input', function (e) {
        if (dataIndex < 0) return;
        var value = e.delegateTarget.value;
        var jsonInfo = getInfo();
        jsonInfo.Name = value;
        var obj = $(".Step .item_" + dataIndex);
        obj.find("div").html(value);
        setInfo(jsonInfo);
    });
    layui.use(['form'], function () {
        var form = layui.form;
        form.on('select(TypeID)', function (data) {
            if (dataIndex < 0) return;
            $("#positions").css("display", "none");
            $(".PositionLeveDiv").css("display", "none");
            if (data.value == 3) {
                $(".PositionLeveDiv").css("display", "block");
            }
            else if (data.value == 1) {
                $("#positions").css("display", "block");
            }
            var jsonInfo = getInfo();
            jsonInfo.Type = data.value;
            setInfo(jsonInfo);
        });
        form.on('select(PositionLeve)', function (data) {
            if (dataIndex < 0) return;
            var jsonInfo = getInfo();
            jsonInfo.LastPositionLevel = data.value;
            setInfo(jsonInfo);
        });

        form.on('select(CompareAttribute)', function (data) {
            SetConfigFilters();
        });



        form.on('checkbox(PrivacyAttribute)', function (data) {
            if (dataIndex < 0) return;
            var jsonInfo = getInfo();
            if (jsonInfo.HideAttribute == null) { jsonInfo.HideAttribute = []; }
            if (data.elem.checked) {
                var index = $.inArray(data.value, jsonInfo.HideAttribute);
                if (index == -1) {
                    jsonInfo.HideAttribute.push(data.value);
                }
            }
            else {
                jsonInfo.HideAttribute.splice($.inArray(data.value, jsonInfo.HideAttribute), 1);
            }
            setInfo(jsonInfo);

        });

        form.on('checkbox(AtLeastOneSuperior)', function (data) {

            if (dataIndex < 0) return;
            var jsonInfo = getInfo();
            if (data.elem.checked) {
                jsonInfo.AtLeastOneSuperior = true;
            }
            else {
                jsonInfo.AtLeastOneSuperior = false;
            }
            setInfo(jsonInfo);

        });


        form.on('checkbox(EditableAttribute)', function (data) {
            if (dataIndex < 0) return;
            var jsonInfo = getInfo();
            if (jsonInfo.AbledEditAttribute == null) { jsonInfo.AbledEditAttribute = []; }
            if (data.elem.checked) {
                var index = $.inArray(data.value, jsonInfo.AbledEditAttribute);
                if (index == -1) {
                    jsonInfo.AbledEditAttribute.push(data.value);
                }
            }
            else {
                jsonInfo.AbledEditAttribute.splice($.inArray(data.value, jsonInfo.AbledEditAttribute), 1);
            }
            setInfo(jsonInfo);
        });

    });

    // Position select
    $(".myPositions").on('change', ".Position .select input", function (e) {
        if (dataIndex < 0) return;
        var jsonInfo = getInfo();
        var positions = [];
        $(".myPositions .Position .select input.Position").each(function () {
            if ($(this).val() != "" && $(this).val() != "0") {
                positions.push(parseInt($(this).val()));
            }
        });
        jsonInfo.Positions = positions;
        setInfo(jsonInfo);
    });


    $(".myPositions").on("click", "i", function () {
        $(this).parent().remove();
        if (dataIndex < 0) return;
        var jsonInfo = getInfo();
        var positions = [];
        $(".myPositions .Position .select input.Position").each(function () {
            if ($(this).val() != "" && $(this).val() != "0") {
                positions.push($(this).val());
            }
        });
        jsonInfo.Positions = positions;
        setInfo(jsonInfo);
    })



    $("#myFilters").on("change", ".GroupID", function () {
        SetConfigFilters();
    })

    $("#myFilters").on("change", ".Attribute", function () {
        SetConfigFilters();
    })

    $("#myFilters").on("change", ".Value", function () {
        SetConfigFilters();
    })

    $("#myFilters").on("click", ".deleteItem", function () {
        $(this).parent().parent().remove();
        SetConfigFilters();
    })


    function SetConfigFilters() {
        if (dataIndex < 0) return;
        var jsonInfo = getInfo();
        var filters = [];
        $("#myFilters tbody tr").each(function (index, item) {
            var GroupID = $(item).find(".GroupID").val();
            var Attribute = $(item).find(".Attribute").val();
            var Value = $(item).find(".Value").val();
            if ($(item).find(".xmSelect").eq(0).css('display') != "none") {
                var olValue = $(item).find(".xm-select-default").eq(0).val();
                Value = $(item).find(".xm-select-default").eq(0).val();
            }
            console.log(Attribute + "---" + Value);
            var Type = $(item).find(".Type").val();
            if (Attribute != "" && Value != "") {
                var filter = { GroupID: GroupID, Attribute: Attribute, Type: Type, Value: Value };
                filters.push(filter);
            }

        });
        jsonInfo.Filters = filters;
        console.log(filters);
        setInfo(jsonInfo);
    }
</script>